@tailwind base;
@tailwind components;
@tailwind utilities;


@layer base {
  h1 {
    @apply text-2xl font-bold;
  }
}

@layer components {
    .btn-blue{
        @apply bg-blue-500 text-white px-2 py-1 rounded hover:bg-blue-300 transition-colors
    }
}
.content-area{
    @apply bg-yellow-200 p-4 rounded;
    height: theme('spacing.128')
}

@media screen(xl){
    .content-area{
        @apply bg-slate-800 text-white;
    }
}